<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>企业实战后台管理系统</title>
    <link rel="stylesheet" href="/layui/css/layui.css">
    <style type="text/css">
        .login {
            height: 190px;
            width: 340px;
            padding: 20px;
            background-color: rgba(0, 0, 0, 0.5);
            border-radius: 4px;
            position: absolute;
            left: 50%;
            top: 50%;
            margin: -150px 0 0 -150px;
            z-index: 99;
        }

        a {
            width: 300px;
        }

        .carousel {
            width: 100%;
            height: 100%;
            position: absolute;
            left: 0;
            top: 0;
            z-index: 90;
            background-color: rgba(0, 0, 0, 0.3);
        }
    </style>
</head>
<body>
<div class="layui-carousel carousel" lay-filter="carousel" id="carousel">
    <div carousel-item="" id="background">
        <div><img src="/images/background1.jpg" width="100%" height="100%"></div>
        <div><img src="/images/background2.jpg" width="100%" height="100%"></div>
    </div>
    <div class="layui-container login">
        <form id="loginForm" action="/user/login" class="layui-form" method="post" layui-form-pane>
            <input name="type" type="hidden" value="1">
            <input type="text" name="username" lay-verify="required" placeholder="请输入账号" autocomplete="off"
                   class="layui-input">
            <br>
            <input type="password" name="password" lay-verify="required" placeholder="请输入密码" autocomplete="off"
                   class="layui-input">
            <br>
            <a class="layui-btn  layui-btn-normal " lay-filter="submit" lay-submit="" id="submit">登录</a>
        </form>
    </div>
</div>
</body>
<script src="/layui/layui.js"></script>
<script src="/js/core.util.js"></script>
<script>
    layui.use(['form', 'jquery', 'carousel'], function () {
        var layer = layui.layer;
        var form = layui.form;
        var $ = layui.jquery;
        // 轮播
        var carousel = layui.carousel;
        form.on('submit', function (data) {
            CoreUtil.sendAjax("/api/user/login", JSON.stringify(data.field), function (res) {
                layer.msg(res.message);
                CoreUtil.setData("access_token", res.data.accessToken);
                CoreUtil.setData("refresh_token", res.data.refreshToken);
                window.location.href = "/view/home";
            }, "POST");
            return false;
        });
        //改变下时间间隔、动画类型、高度
        carousel.render({
            elem: '#carousel'
            , interval: 2000
            , anim: 'fade'
            , full: true        //全屏
            , width: '100%'
            , arrow: 'none'
        });
    })
</script>
</html>